I'm having trouble to make a simple CRUD in my site.

I have a table of registries

<table>   
    <tbody>  
        <?php foreach ($row as $reg) { ?>  
            <tr <?php if ($reg['value'] < 0) { echo "class='error'"; } ?>>  
                <td><?php echo $reg['creditor'] ?></td>  
                <td><?php echo $reg['debtor'] ?></td>  
                <td><?php echo $reg['reason'] ?></td>  
                <td>R$ <?php echo number_format(abs($reg['value']), 2, ',', ' ')?></td>  
                <td><a **href="<?php echo $this->baseUrl(); ?>/history/delete/id/<?php echo $reg['id']; ?>"** class="delete"><img src="http://192.168.0.102/libraries/css/blueprint/plugins/buttons/icons/cross.png" alt=""/></a></td>  
            </tr>  
        <?php } ?>  
    </tbody>  
</table>

which I would like to perform a simple delete in these rows using AJAX (preferenciably with jQuery). The question is: do I have to create a function in JS and add onmouseclick event in the HTML? is there a more consistent way for doing this, like adding $('.delete').click() directly in the js file? If so, how do I pass the row ID for the ajax function?

What I really want is to know how to pass the row ID to $.ajax() jQuery function through a clean! way